<template>
  <div id="app">
    <Nav></Nav>
    <div class="router-view">
      <router-view />
    </div>
    <Bot></Bot>
  </div>
</template>

<script>
import Bot from "@/components/foot/index.vue"
import Nav from "@/components/nav/index.vue"
import { Theme } from '@/constructor/theme-constructor'
export default {
  name: 'HomeView',
  components: {
    Nav,
    Bot
  },
  computed: {
    routerName () {
      return this.$route.name
    }
  },
  methods: {
    initTheme () {
      const themeInstance = new Theme()
      if (this.cloudVersionName === 'Saas' || !this.themeColor) {
        themeInstance.changePrimary()
        return false
      }
      themeInstance.changePrimary(this.themeColor)
    }
  },
  mounted () {
    this.initTheme()
  }
}  
</script>

<style lang="scss" scoped>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #2c3e50;
  display: flex;
  flex-direction: column;
  height: 100%;
  .router-view {
    flex: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    padding-top: 177px;
    box-sizing: border-box;
  }
}
</style>
